import {useEffect, useState} from "react";
import {Question} from "../../types";

import {History} from "../../types";
import {useAtom} from "jotai";
import BaseQuesItem from "../BaseQuesItem";
import {historyCurrentPageAtom, historyPageSizeAtom, selectedIdsAtom} from "../../store/atoms";
import BaseHistoryItem from "./BaseHistoryItem";
import BaseButton from "../BaseButton";
import toast, {Toaster} from "react-hot-toast";

interface Props {
    className?: string
}

function HistoryPageList({className = ''}: Props) {

    const [currentPage] = useAtom(historyCurrentPageAtom)
    const [pageSize] = useAtom(historyPageSizeAtom)
    const [selectedIds, setSelectedIds] = useAtom(selectedIdsAtom)
    const [historyList, setHistoryList] = useState<History[]>([]);
    useEffect(() => {
        const offset = (currentPage - 1) * pageSize;
        window.ipcRender.invoke('history:getList', {
            limit: pageSize,
            offset: offset,
        }).then((res) => {
            setHistoryList(res);
            console.log("当前页打印历史id列表:", res.map((h: History) => h.id));
        })
    }, [currentPage, pageSize]);

    return (
        <div className={`m-2 ${className}`}>
            <Toaster
                reverseOrder={true}
                toastOptions={{
                    duration: 1000,
                    error: {
                        duration: 2000,
                    },
                    success: {
                        duration: 2000,
                    }
                }}
            />
            {historyList.map((history) => (
                <div key={history.id} className="flex items-start gap-2">
                    {/* 左侧加号按钮 */}
                    <button className="btn btn-square mt-5 text-md "
                            onClick={() => {
                                const idsToAdd = (history.ques_ids || '')
                                    .split(',')
                                    .map(s => s.trim())
                                    .map(s => Number(s.trim()))
                                    .filter(n => !isNaN(n));
                                console.log(`添加考题id：${idsToAdd}`);
                                setSelectedIds(prev => [
                                    ...prev,
                                    ...idsToAdd.filter(id => !prev.includes(id))
                                ])
                                toast.success("考题已添加");
                            }}
                    >
                        <span className="fa fa-plus " aria-hidden="true"/>
                    </button>
                    {/* 右侧历史记录信息 */}
                    <div className="flex-1">
                        <BaseHistoryItem
                            className="flex items-start gap-2"
                            history={history}
                        />
                    </div>
                    {/*<div>*/}
                    {/*    <button className="btn btn-square mt-5"*/}
                    {/*            onClick={() => {}}>*/}
                    {/*        <span className="fa fa-star-o fa-lg"/>*/}
                    {/*    </button>*/}
                    {/*</div>*/}
                </div>
            ))}
        </div>
    )
}

export default HistoryPageList;